<template>
	<view class="page-my-arena">
		<view class="txts">*订单只能在开场前2小时进行退款</view>
		<MxMyArenaCard class="cmp-my-arena-card" v-for="order in orderList" :order="order" />
		<EmptyData v-if="!hasBooking" />
	</view>
</template>

<script>
	import MxMyArenaCard from '@/components/mine/my-arena/MxMyArenaCard.vue';
	import EmptyData from '@/components/common/EmptyData.vue'
	import * as arenaApi from '@/api/arena.js'
	
	export default {
		components: {
			MxMyArenaCard,
			EmptyData
		},
		data() {
			return {
				orderList: []
			};
		},
		computed: {
			hasBooking() {
				return this.orderList.length !== 0
			}
		},
		onLoad() {
			arenaApi.userBooking().then(res => {
				this.orderList = res.data
			})
		},
		/*分享当前页面*/
		onShareAppMessage() {
			let self = this;
			return {
				title: '恩平市体育馆',
				path: '/pages/index/index'
			};
		},
		onShareTimeline(){
			return {
			  title: "恩平市体育馆",
			  path: `/pages/index/index`
			 }
		}
	}
</script>

<style scoped lang="scss">
	.page-my-arena {
		padding: 30rpx 24rpx;
		.txts{
			color: red;
			text-align: center;
			margin: 15rpx;
		}
		.cmp-my-arena-card {
			// margin-bottom: 36rpx;
		}
	}
</style>
